{% extends "../_base/layout.html" %} 
{% block css %}
<link rel="stylesheet" href="{{site.static}}/css/index_integral.css"> 
{%endblock%}
{% block content %} 
    {% block header%}
    {% set pageHeaderConf = {pageTitle:__("integral_page_title"),level:2,icon:'eui-icon-menu btn-show-siderbar'} %} 
    {% include "../_base/page_header.html" %} 
    {% endblock %}
<div class="eui-main-container eui--padding-b-0 integral-main-container">
    {% block banner%}
    {% include "../common/page_banner.html" %} 
    {% endblock %}      
    <div class="eui-card eui-guess-u-like-card">
        <span class="eui-btn eui-btn-white">{{__("btn_exchange")}}</span>
        <div class="eui-card-header">
            {{__("integral_card_title")}}            
        </div>
        <div class="eui-card-content">
            {% block guessULike%}
            {% include "../common/guess_u_like.html" %} 
            {% endblock %}  
        </div>
    </div>    
</div>

<div class="eui-siderbar-wrapper eui-siderbar-fixed eui-siderbar-fixed-right eui--white-bacg" id="siderbar">
    <div class="eui-sider-bar eui--position-rel">
        <div class="eui-bar page-header">
            <div class="eui-bar-nav">
                <a href="javascript:;" class="eui-icon eui-icon-back" id="btn_back_siderbar"></a>
                <h1 class="page-title eui--text-center">{{__("integral_gift_type")}}</h1>
            </div>
        </div>
        <ul class="eui--table-view eui--black-color eui--font-32">
            <li class="eui--table-view-cell eui--text-center">{{__("integral_type_vip")}}</li>
            <li class="eui--table-view-cell eui--text-center">{{__("integral_type_free")}}</li>
            <li class="eui--table-view-cell eui--text-center">{{__("integral_type_special")}}</li>
            <li class="eui--table-view-cell eui--text-center">{{__("integral_type_limit")}}</li>
            <li class="eui--table-view-cell eui--text-center">{{__("integral_type_mysterious")}}</li>            
        </ul>
    </div>        
</div>
<script>
    $('.btn-show-siderbar').click(function(){
        $('#siderbar').animate({
            "right":'0'
        },500);
    });
    $('#btn_back_siderbar').click(function(){
        $('#siderbar').animate({
            "right":'-100%'
        },500);
    });
</script>

{% endblock %} {% set footerActiveIndex = 0 %}